import React, {FC} from 'react';
import "./index.less";
import "../../index.less";
import SearchArticle from "@/pages/SearchPage/SearchArticle";
import {Button, Space} from "antd";
import {SearchOutlined} from "@ant-design/icons";
import {history} from "@@/core/history";
import usePgSearch, {getLastQueryValue} from "@/pages/SearchPage/common/usePgSearch";
import {useParams} from "umi";
import {useRequest} from "ahooks";
import * as API from "@/services";

interface AdvSearchArticleProps {
}

const AdvSearchArticle: FC<AdvSearchArticleProps> = (props) => {
  const {specialColumnId} = useParams();
  const {currentSearch} = usePgSearch();

  const specialColumnDetailReq = useRequest(() => API.queryFrontJournalSpecialColumn(specialColumnId!), {
    refreshDeps: [specialColumnId],
    ready: !!specialColumnId
  });

  return (
    <div className={"adv-search-article-container"}>
      <SearchArticle
        additionalQuery={specialColumnId ? {
          specialColumnIds: specialColumnId
        }: undefined}
        searchRecordListTopExtra={
          !specialColumnId ? (
            <div className={"es-dslbar"}>
              <div className={"es-dsl-header"}>
                表达式：
              </div>
              <div className={"es-dsl-content"}>
                {getLastQueryValue(currentSearch, "dsl")}
              </div>
              <div className={"es-dsl-tools"}>
                <Space>
                  <Button type={"link"} icon={<SearchOutlined/>} onClick={() => {
                    history.push({
                      pathname: "/search-adv",
                      search: location.search
                    });
                  }}>高级检索</Button>
                </Space>
              </div>
            </div>
          ) : null
        }
      />
    </div>
  );
};

export default AdvSearchArticle;
